import React from 'react'
import { View, Image, Clipboard, AppState } from 'react-native'
// import {StackActions, NavigationActions } from "react-navigation"
import SplashScreen from "react-native-splash-screen"
import { Projector } from "../_teaset"
import { Lt, NavTheme as Nav, Color, Label, Images, Touch,  Navigator, Jpp, Dialog, Jx } from "../_utils"
import { eApp, FieldProps } from "../home/_home"
import { SegProjector } from '../_util';
import { eField } from '../home/_efield';
import { ApplyHome, TouchApps } from './ApplyHome';
import { ApplyHomeSec } from './ApplyHomeSec';

export class ApplyHomes extends React.PureComponent{
    constructor(props){
        super(props);

        this.state = {
            fieldIdx:0,
        }

        this.goodslist = null;

        this.onChange = this.onChange.bind(this);
    }

    static navigationOptions = {
        tabBarIcon : ({focused, tintColor})=><Image source={focused ? Images.shouye_2 : Images.shouye}/>
    }

    componentDidMount(){
        SplashScreen.hide();
    }
    onChange(fieldIdx){
        this.setState({fieldIdx});
        this.goodslist && this.goodslist.setFieldIdx(fieldIdx);
    }
    render(){
        const app = eApp.HOME;
        return <View style = {{flex:1}}>
            <Nav.StateBar/>
            <TouchApps onAppIdx={appIdx=>Navigator.push("ApplyApps", {appIdx})}/>
            <SegProjector fields={eField[app].map(v=>v.name)} onChange={this.onChange} {...FieldProps}/>
            <Projector style={{flex:1}} index={(this.state.fieldIdx===0)?0:1}>
                <ApplyHome/>
                <ApplyHomeSec ref={r=>this.goodslist=r} app ={app}/>
            </Projector>
        </View>;
    }
}